<template>
		<div>
			<div @click="handleOpenApp" ><slot></slot></div>
			<div class="open_app_fail_tips"  v-show="showFailTips" @click="showFailTips = false">
				<div class="tips_main"></div>
			</div>
		</div>
	</template>
	
	<script>
		const ua = window.navigator.userAgent;
		import nativeSchema from '../js/tool-native-schema';
		export default {
			name: 'y-openapp',
			props: {
				id: '',
				routerAddr: '',
				passprops: '',
			},
			data() {
				return {
					showFailTips: false,
				}
			},
			methods: {
			handleOpenApp() {
				if (!this.hasClickOnce) {
					this.hasClickOnce = true;
					if (ua.toLowerCase().match(/micromessenger/i) || ua.toLowerCase().match(/WeiBo/i)) {
						this.showFailTips = true;
					} else {
						this.openApp();
					}
				}
				setTimeout(() => {
					this.hasClickOnce = false;
				}, 2000);
			},
			openApp() {
					nativeSchema.loadSchema({
						// 某个schema协议，例如login,
						schema: `/${this.routerAddr}?${this.passprops}=${this.id}`,
						// schema头协议，
						protocal: "lovelorn://react-native",
						// 发起唤醒请求后，会等待loadWaiting时间，超时则跳转到failUrl，默认3000ms
						loadWaiting: 3000,
						// 唤起失败时的跳转链接，默认跳转到应用商店下载页
						failUrl: ua.indexOf('Android') > -1 ? "https://sj.qq.com/myapp/detail.htm?apkName=com.yryz.lovelorn" : 'itms-apps://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=1438503085',
						// failUrl: window.location.href = window.location.origin + '/static/page/download.html'
					});
				},
		}
		}
	
	</script>
	
	<style scoped>
		.openapp_wrap {
			background: #f9f9f9;
			height: 1rem;
			padding: 0 0.46rem 0 0.3rem;
			display: flex;
			justify-content: space-between;
			align-items: center;
	
			& .left {
				display: flex;
	
				& .logo {
					width: 0.7rem;
					height: 0.7rem;
				}
	
				& .app_name {
					display: flex;
					flex-direction: column;
					justify-content: center;
					margin-left: 0.2rem;
				}
	
				& .logo_text {
					width: 0.5rem;
					height: 0.31rem;
					display: block
				}
	
				& .text {
					line-height: 1;
					margin-top: 0.1rem;
					font-size: 0.22rem;
					color: #000;
				}
			}
	
			& .btn {
				width: 1.3rem;
				height: 0.5rem;
				background: url('../assets/openapp_bg.png') no-repeat;
				background-size: contain;
				font-size: 0.24rem;
				color: #fff;
				text-align: center;
				line-height: 0.5rem;
			}
		}
	
	</style>	